import 'package:baselib/utils/image_util.dart';
import 'package:baselib/widgets/comm_app_bar.dart';
import 'package:baselib/widgets/gradient_card_view.dart';
import 'package:baselib/widgets/inkwell_button.dart';
import 'package:flutter/material.dart';
import 'package:framelib/utils/color_util.dart';
import 'package:framelib/utils/drawable_util.dart';
import 'package:framelib/utils/px_util.dart';
import 'package:framelib/utils/string_util.dart';
import 'package:framelib/widgets/keep_alive_wrapper_widget.dart';
import 'package:framelib/widgets/page_widget.dart';
import 'package:get/get.dart';
import 'package:module_business/module_index/viewmodel/index_view_model.dart';

import 'index_tag_page.dart';

/**
 * 注册主页
 */
class IndexPage extends GetWidget<IndexViewModel> {
  IndexPage({Key key}) : super(key: key) {}

  @override
  Widget build(BuildContext context) {
    Get.put(IndexViewModel());
    return PageWidget.build(builder: (IndexViewModel model) {
      return PageWidget.PageScaffoldWidget(
        isShowBg: true,
        appBar: CommAppBar(
          leadingWidth: PxUtil.instance.screenWidth,
          leading: Row(
            children: [
              Expanded(child: Container(
                  margin: EdgeInsets.only(
                    left: PxUtil.instance.px_15,
                  ),
                  alignment: Alignment.centerLeft,
                  child: Text(
                    StringUtil.instance.Interest_Voice,
                    style: TextStyle(
                        fontSize: PxUtil.instance.px_24,
                        fontWeight: FontWeight.bold
                    ),
                  )
              )),
              InkWellButton(
                onPressed: ()=>model.voiceRoomAdd(),
                child: Container(
                  width: PxUtil.instance.px_55,
                  padding: EdgeInsets.only(
                    left: PxUtil.instance.px_15,
                    right: PxUtil.instance.px_15,
                  ),
                  child:
                  ImagesUtil.loadAssetImage(
                      (model.myRoomItemEntity?.id==null)?
                      DrawableUtil.instance.icon_index_add:
                      DrawableUtil.instance.icon_has_room,
                      width: PxUtil.instance.px_24,
                      fit: BoxFit.fitWidth
                  ),
                ),
              )
            ],
          ),
          backgroundColor: ColorUtil.instance.color_transparent,
        ),
        body: Column(
          children: [
            //tags
            Container(
              height: PxUtil.instance.px_24,
              margin: EdgeInsets.only(
                top: PxUtil.instance.px_10,
                bottom: PxUtil.instance.px_10,
              ),
              alignment: Alignment.centerLeft,
              child: ListView.builder(
                  padding: EdgeInsets.only(
                    left: PxUtil.instance.px_15,
                    right: PxUtil.instance.px_15,
                  ),
                  shrinkWrap: true,
                  scrollDirection: Axis.horizontal,
                  itemCount: model.voiceChatTags?.length ?? 0,
                  itemBuilder: (BuildContext context, int index) {
                    var voiceChatTag = model.voiceChatTags[index];
                    return model.selectedTagIndex == index?
                      Container(
                        margin: EdgeInsets.only(
                          right: PxUtil.instance.px_8d5,
                        ),
                        child: GestureDetector(
                          onTap: ()=>model.tagItemClick(index),
                          child: GradientCardView(
                              elevation: PxUtil.instance.px_0,
                              height: PxUtil.instance.px_22,
                              margin: EdgeInsets.only(),
                              padding: EdgeInsets.only(
                                left: PxUtil.instance.px_16,
                                right: PxUtil.instance.px_16,
                              ),
                              borderWidth: PxUtil.instance.px_0d5,
                              borderRadius: BorderRadius.circular(PxUtil.instance.px_12),
                              alignment: Alignment.center,
                              child: Text(
                                voiceChatTag?.tagName,
                                style: TextStyle(
                                  color: ColorUtil.instance.color_white,
                                  fontSize: PxUtil.instance.px_11,
                                ),
                              )
                          ),
                        ),
                      ):
                      Container(
                        margin: EdgeInsets.only(
                          right: PxUtil.instance.px_8d5,
                        ),
                        child: GestureDetector(
                          onTap: ()=>model.tagItemClick(index),
                          child: GradientCardView(
                              margin: EdgeInsets.only(),
                              elevation: PxUtil.instance.px_0,
                              height: PxUtil.instance.px_22,
                              borderRadius: BorderRadius.circular(PxUtil.instance.px_12),
                              borderWidth: PxUtil.instance.px_0d5,
                              child: Container(
                                // margin: EdgeInsets.only(
                                //     right: PxUtil.instance.px_8
                                // ),
                                padding: EdgeInsets.only(
                                  left: PxUtil.instance.px_16,
                                  right: PxUtil.instance.px_16,
                                ),
                                decoration: BoxDecoration(
                                    color: ColorUtil.instance.color_2F4072,
                                    borderRadius:
                                    BorderRadius.circular(PxUtil.instance.px_12)),
                                alignment: Alignment.center,
                                child: Text(
                                  voiceChatTag?.tagName,
                                  style: TextStyle(
                                    color: ColorUtil.instance.color_white,
                                    fontSize: PxUtil.instance.px_11,
                                  ),
                                ),
                              )
                          ),
                        ),
                      );
                  }),
            ),
            //PageView
            Expanded(child: PageView(
              controller: model.pageController,
              onPageChanged: (int pageIndex)=>model.onPageChanged(pageIndex),
              children: (model.voiceChatTags??[]).map((e) =>
                KeepAliveWrapper(
                    IndexTagPage(
                      voiceChatTag: e,
                    )
                )
              ).toList(),
            ))
          ],
        ),
      );
    });
  }
}
